﻿@*
    For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*@
@{
    Layout = null;
}
<link href="~/lib/layui/css/layui.css" rel="stylesheet" />
@* <script src="~/lib/layui/layui.js"></script> *@
<script src="~/js/js.cookie.js"></script>
<script src="~/js/moment.js"></script>
<script src="~/lib/jquery/dist/jquery.js"></script>

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>角色列表</title>
    <!-- 请勿在项目正式环境中引用该 layui.css 地址 -->

</head>
<body>
    <form class="layui-form layui-row layui-col-space16">
        <div class="layui-col-md4">
            <div class="layui-input-wrap">
                <div class="layui-input-prefix">
                    <i class="layui-icon layui-icon-username"></i>
                </div>
                <input type="text" name="userName" value="" placeholder="请输入用户名" class="layui-input" lay-affix="clear">
            </div>
        </div>
   
        <div class="layui-btn-container layui-col-xs12">
            <button class="layui-btn" lay-submit lay-filter="demo-table-search">查询</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </form>
    <table class="layui-table" id="ID-table-demo-init">
        @*  <colgroup>
        <col width="150">
        <col width="150">
        <col>
        </colgroup> *@
        <thead>
            <tr>
                <th>序号</th>
                <th>用户</th>
                <th>密码</th>
                <th>状态</th>
                <th>操作 </th>
            </tr>
        </thead>
        <tbody id="ThisTb">
        </tbody>
    </table>

    <!-- 请勿在项目正式环境中引用该 layui.js 地址 -->
    <script src="//unpkg.com/layui@2.9.20/dist/layui.js"></script>
    <script>
        layui.use(function () {
            var table = layui.table;
            var form = layui.form;
            var laydate = layui.laydate;
            var userName=$("[name='userName']").val();
            // 搜索提交
            form.on('submit(demo-table-search)', function (data) {
                var field = data.field; // 获得表单字段
                getList(field.userName);
                return false; // 阻止默认 form 跳转
            });
            
            $(function () {
                getList(null);
            })
            function getList(val) {
                $.ajax({
                    url: '@ViewBag.RBACWrite'+ '/api/RBAC/ListUser',
                    data: { UserName: val },
                    type:'get',
                    success: function (res) {
                        $("#ThisTb").empty();
                        if (res.data!=null) {
                            $(res.data).each(function (i, item) {
                                $("#ThisTb").append(`<tr>
                                <td>${i+1}</td>
                                <td>${item.userName}</td>
                                <td>******</td>
                                <td>${item.state}</td>
                                <td>
                                    <button type="button" class="layui-btn layui-bg-blue">编辑</button>
                                    <button type="button" class="layui-btn layui-bg-orange">删除</button>
                                </td>
                            </tr>`)
                            })
                        }
                        
                    }
                })
            }
        });
    </script>
</body>
</html>
